<template>
  <div>
    <div class="search">
      <input v-model="culid" placeholder="请输入文物id" />
      <van-button icon="search" @click="finbyid(culid)" plain>查找</van-button>
    </div>
    <div class="detail" v-for="(item,index) in list" :key="index">
      <img class="crimg" v-if="item.crPic!==''" :src="picurl+item.crPic" />
      <div class="listinfo" v-if="item.crNo!==''">
        <p class="crNo">文物编号：{{item.crNo}}</p>
        <p class="crName" >文物名字：{{item.crName}}</p>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      // 文物信息
      list: [],
      culid: "",
      // 文物信息条数
      total: "",
      picurl: "http://zwyzy.vipgz6.idcfengye.com"
    };
  },
  methods: {
    // 获取文物列表
    async getlist() {
      const res = await this.$http.get({ url: "crms/crmsAdmin/list" });
      if (res.code != 200) {
        wx.showToast({
          title: "获取资料失败，请下拉刷新",
          icon: "none",
          duration: 1500
        });
      }
      this.list = res.data.crifoList;
      this.list.forEach(item => {
        if (item.crName == null) item.crName = "未命名";
      });
      this.total = res.data.total;
      console.log(this.list);
      console.log(this.total);
    },
    async finbyid(id) {
      console.log(id);
      const res = await this.$http.get({
        url: "crms/crmsAdmin/getCrifo/"+id,
      });
      if(res.code==-1){
        wx.showToast({
          title: '查无结果',
          icon: 'none',
          duration: 1500,
        });
      }
      console.log(res);
      this.list = []
      this.list[0] = res.data.crifoVo
      console.log(this.list);
    }
  },
  beforeMount() {
    this.getlist();
  },
  // 页面上滑 滚动条触底事件
  onReachBottom() {
    wx.showToast({
      title: "没有下一页数据了"
    });
  },
  // 页面下拉生命周期事件
  onPullDownRefresh() {
    // 1 重置数组
    this.list = [];
    //  发送请求
    this.getlist();
    // 关闭下拉等待效果
    wx.stopPullDownRefresh();
  },
  computed: {
    imgsrc(src) {
      return "http://zwyzy.vipgz6.idcfengye.com/" + src;
    }
  }
};
</script>

<style>
page {
  height: 100%;
  background: #f3f3f3;
}
.search {
  margin-top: 20rpx;
  height: 70rpx;
  width: 90%;
  display: flex;
  justify-content: center;
}
.van-button {
  margin-left: 20rpx;
  height: 100% !important;
  border: 1rpx solid #000 !important;
}
input {
  height: 100%;
  border: 1rpx solid #000;
}
.detail {
  margin-top: 20rpx;
  margin-left: 30rpx;
  display: flex;
  border-bottom: 1rpx solid #eeeeee;
}
.crimg {
  width: 128rpx;
  height: 128rpx;
  margin-right: 20rpx;
}
.listinfo {
  display: flex;
  flex-direction: column;
  justify-content: center;
  font-size: 30rpx;
  width: 70%;
}
</style>